<%@ page import="entity.User" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<head>
    <title>主页</title>

    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
    <!-- Custom Theme files -->
    <link href="https://cdn.bootcss.com/twitter-bootstrap/4.2.1/css/bootstrap.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/resource/css/style2.css" rel="stylesheet" type="text/css"
          media="all"/>
    <!-- Custom Theme files -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <script type="application/x-javascript"> addEventListener("load", function () {
        setTimeout(hideURLbar, 0);
    }, false);

    function hideURLbar() {
        window.scrollTo(0, 1);
    } </script>
    <!--webfont-->
    <link href='http://fonts.googleapis.com/css?family=Roboto:400,100,100italic,300,300italic,400italic,500,500italic,700,700italic,900,900italic'
          rel='stylesheet' type='text/css'/>

    <style>
        /*按钮样式*/
        ul.top-menu > li > .logout {
            color: #f2f2f2;
            font-size: 12px;
            border-radius: 4px;
            -webkit-border-radius: 4px;
            border: 1px solid #64c3c2 !important;
            padding: 5px 15px;
            margin-right: 15px;
            background: #4ECDC4;
            margin-top: 15px;
        }

        .right_column li {
            padding: 0 0 0 0;
        }

        .blog-section .container {
            max-width: 1400px;
        }

      .alpha1 a img:hover {
            -webkit-animation:sucaijiayuan 1s .1s ease both;
            -moz-animation:tada 1s .1s ease both;
        }
        @-webkit-keyframes sucaijiayuan {
            0% {
                -webkit-transform: scale(1)
            }
            10%, 20% {
                -webkit-transform: scale(0.8) rotate(-2deg)
            }
            30%, 50%, 70%, 90% {
                -webkit-transform: scale(1.1) rotate(2deg)
            }
            40%, 60%, 80% {
                -webkit-transform: scale(1.1) rotate(-2deg)
            }
            100% {
                -webkit-transform: scale(1) rotate(0)
            }
        }
    </style>
</head>
<body>
<!-- header-section-starts -->
<div class="header">
    <div class="container">
        <div class="logo">
            <a href="index.html"><img src="${pageContext.request.contextPath}/resource/img/friends/fr-09.jpg"
                                      class="img-responsive" alt="" style="width: 100px; height: 100px;margin-right: 20px;"/></a>
            <label style="margin-left: 200px;font-size: 40px;margin: 0;color: #ffffff;">看神马新闻</label>
        </div>
        <div class="header-right">
            <%
                User user = (User) session.getAttribute("user");
                if (user != null) {
            %>
            <h4 style="margin-right: -150px;margin-top: 13px"><span style="margin-left: 20px;font-size: 38px" ><%=user.getUserName()%></span>
                <ul class="pull-right top-menu" style="list-style:none;">
                    <li><a class="logout"
                           href="${pageContext.request.contextPath}/user/Logout?userName=<%=user.getUserName()%>">Logout</a>
                    </li>
                </ul>
            </h4>
            <%
            } else {
            %>
            <h4 style="margin-right: -150px;margin-top: 13px">
                <div style="margin-left: 20px;font-size: 38px">未登录</div>
                <ul class="pull-right top-menu" style="list-style: none">
                    <li style="">
                        <a class="logout" href="${pageContext.request.contextPath}/user/login1.html">ToLogin</a>
                        <a class="logout" href="${pageContext.request.contextPath}/user/register.html">ToRegister</a>
                    </li>

                </ul>
            </h4>
            <%
                }
            %>

            <span class="menu"></span>
            <div class="top-menu">
                <ul>
                    <li><a class="active" href="${pageContext.request.contextPath}/user/index.html">新闻主页</a></li>
<%--                    <li><a href="https://www.cnblogs.com/yangdagaoge/">项目日记</a></li>--%>
                    <li><a href="https://gitee.com/zheng_bin9812/news.git">项目地址</a></li>
                    <li><a href="${pageContext.request.contextPath}/user/center.html">个人中心</a></li>
                </ul>
            </div>
            <!-- script for menu -->
            <script>
                $("span.menu").click(function () {
                    $(".top-menu").slideToggle("slow", function () {
                        // Animation complete.
                    });
                });
            </script>
            <!-- script for menu -->
        </div>
        <div class="clearfix"></div>
    </div>
</div>
<c:if test="${!result.isSuccess}">
    <span style="color: rebeccapurple">${result.errMes}</span>
</c:if>
<!-- header-section-ends -->
<div class="content">
    <div class="blog-section">
        <div class="container">
            <div class="col-md-10 " style="float: left">
<%--            <div class="col-md-10 left_column" style="float: left">--%>
                <h2 class="with-line">新闻列表</h2>

                <c:forEach var="data" items="${newData}">
                    <article class="clearfix">
                        <header class="grid_8 alpha">
                            <div class="sub">
                                <a href="${pageContext.request.contextPath}/new/detail?newId=${data.aNew.newId}"
                                   class="readblog">${data.aNew.title}</a>
                                <p class="sub_head">Posted by <a href="#">${data.userName}
                                </a>
                                        <%--                                    with <a href="#">3--%>
                                        <%--                                    comment(s)</a>--%>
                                </p>
                            </div>
                            <div class="clearfix"></div>
                        </header>
                        <c:choose>
                            <c:when test="${data.aNew.content.length()>0}">
                                <div class="alpha1"><a href="${pageContext.request.contextPath}/new/detail?newId=${data.aNew.newId}"><img
                                        src="${data.aNew.content}" alt=""/></a>
                                </div>
                            </c:when>
                            <c:otherwise>
                                <c:if test="${data.aNew.categoryId==1}">
                                    <div class="alpha1"><a href="${pageContext.request.contextPath}/new/detail?newId=${data.aNew.newId}"><img
                                            src="${pageContext.request.contextPath}/resource/img/hotpot.png" alt=""/></a>
                                    </div>
                                </c:if>
                                <c:if test="${data.aNew.categoryId==2}">
                                    <div class="alpha1"><a href="${pageContext.request.contextPath}/new/detail?newId=${data.aNew.newId}"><img
                                            src="${pageContext.request.contextPath}/resource/img/entertainment.png" alt=""/></a>
                                    </div>
                                </c:if>
                                <c:if test="${data.aNew.categoryId==3}">
                                    <div class="alpha1"><a href="${pageContext.request.contextPath}/new/detail?newId=${data.aNew.newId}"><img
                                            src="${pageContext.request.contextPath}/resource/img/tech.png" alt=""/></a>
                                    </div>
                                </c:if>
                                <c:if test="${data.aNew.categoryId==4}">
                                    <div class="alpha1"><a href="${pageContext.request.contextPath}/new/detail?newId=${data.aNew.newId}"><img
                                            src="${pageContext.request.contextPath}/resource/img/military.png" alt=""/></a>
                                    </div>
                                </c:if>
                                <c:if test="${data.aNew.categoryId==5}">
                                    <div class="alpha1"><a href="${pageContext.request.contextPath}/new/detail?newId=${data.aNew.newId}"><img
                                            src="${pageContext.request.contextPath}/resource/img/sport.png" alt=""/></a>
                                    </div>
                                </c:if>
                                <c:if test="${data.aNew.categoryId==6}">
                                    <div class="alpha1"><a href="${pageContext.request.contextPath}/new/detail?newId=${data.aNew.newId}"><img
                                            src="${pageContext.request.contextPath}/resource/img/international.png" alt=""/></a>
                                    </div>
                                </c:if>
                            </c:otherwise>
                        </c:choose>
<%--                        <c:if test="${data.aNew.content.length()>0}">--%>
<%--                            <div class="alpha1"><a href="/new/detail?newId=${data.aNew.newId}"><img--%>
<%--                                    src="${data.aNew.content}" alt=""/></a>--%>
<%--                            </div>--%>
<%--                        </c:if>--%>
<%--                        <c:if test="${data.aNew.newId%3==0}">--%>
<%--                            <div class="alpha1"><a href="/new/detail?newId=${data.aNew.newId}"><img--%>
<%--                                    src="${pageContext.request.contextPath}/resource/img/index-3_img-1.jpg" alt=""/></a>--%>
<%--                            </div>--%>
<%--                        </c:if>--%>
<%--                        <c:if test="${data.aNew.newId%3==1}">--%>
<%--                            <div class="alpha1"><a href="single.html"><img--%>
<%--                                    src="${pageContext.request.contextPath}/resource/img/index-3_img-2.jpg" alt=""/></a>--%>
<%--                            </div>--%>
<%--                        </c:if>--%>
<%--                        <c:if test="${data.aNew.newId%3==2}">--%>
<%--                            <div class="alpha1"><a href="single.html"><img--%>
<%--                                    src="${pageContext.request.contextPath}/resource/img/index-3_img-3.jpg" alt=""/></a>--%>
<%--                            </div>--%>
<%--                        </c:if>--%>

                        <div class="grid_b4">
                            <h5>${data.aNew.summary}</h5>
                            <p>${data.typeName}|${data.aNew.keyWords}</p>
                            <a href="${pageContext.request.contextPath}/new/detail?newId=${data.aNew.newId}" class="btn btn-1 btn-1c">Read More</a>
                        </div>
                        <div class="clearfix"></div>
                    </article>
                </c:forEach>

            </div>

            <div class="col-md-2 right_column" style="float: right;">

                <div class="item2">
                    <header>
                        <h2 class="with-line">与我相关</h2>
                    </header>
                    <ul style="padding:0 0 0 0">
                        <li><a href="${pageContext.request.contextPath}/new/editor.html?index=1">添加文章</a></li>
                        <li><a href="${pageContext.request.contextPath}/user/center.html">我发表的文章</a></li>
                        <li><a href="${pageContext.request.contextPath}/user/center.html">我的评论</a></li>
                        <li><a href="${pageContext.request.contextPath}/user/center.html">我的消息</a></li>
                    </ul>
                </div>

                <div class="item">
                    <header>
                        <h2 class="with-line">新闻分类</h2>
                    </header>
                    <ul>
                        <li><a href="${pageContext.request.contextPath}/user/index.html?categoryId=1">全部新闻</a></li>
                        <li><a href="${pageContext.request.contextPath}/new/forPointNews?categoryId=1">热点</a></li>
                        <li><a href="${pageContext.request.contextPath}/new/forPointNews?categoryId=2">娱乐</a></li>
                        <li><a href="${pageContext.request.contextPath}/new/forPointNews?categoryId=3">科技</a></li>
                        <li><a href="${pageContext.request.contextPath}/new/forPointNews?categoryId=4">军事</a></li>
                        <li><a href="${pageContext.request.contextPath}/new/forPointNews?categoryId=5">体育</a></li>
                        <li><a href="${pageContext.request.contextPath}/new/forPointNews?categoryId=6">国际</a></li>
                    </ul>
                </div>

            </div>
            <div class="clearfix"></div>
        </div>
    </div>
</div>


<div class="footer text-center">
    <div class="copyright">
<%--        <p> © Copyrights <strong></strong>. All Rights Reserved--%>
<%--            <a target="_blank" href="https://github.com/fireshoot/YxNews">项目地址</a></p>--%>
    </div>
</div>


<%--<script type="text/javascript">--%>

<%--    $(document).ready(function () {--%>
<%--        sizecontrol();--%>
<%--        alert(1);--%>
<%--    })--%>


<%--    function sizecontrol(){--%>
<%--        var max1=200;--%>
<%--        var contentWrappers= document.getElementsByClassName("grid_b4");--%>

<%--        for (var i=0;i<contentWrappers.length;i++) {--%>
<%--           if (contentWrappers[i].firstChild.nodeValue.length > max1){--%>
<%--               contentWrappers[i].firstElementChild.nodevalue=contentWrappers[i].firstElementChild.nodeValue.substr(0,max1)--%>
<%--            }--%>
<%--        }--%>

<%--    }--%>
<%--</script>--%>



</body>
</html>